<template>
  <div class="box">
    <div class="head">发起提现</div>
    <div class="list fir" v-if="info.enterprise">
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">企业名称：</span>
      <span>{{info.accountName}}</span>
    </div>
    <div class="list fir" v-else>
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">姓名：</span>
      <span>{{info.accountName}}</span>
    </div>
    <div class="list">
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">银行名称：</span>
      <span>{{info.bankName}}</span>
    </div>

    <div class="list" v-if="info.enterprise" >
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">税号：</span>
      <span>{{info.dutyParagraph}}</span>
    </div>
    <div class="list">
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">银行账号：</span>
      <span>{{info.bankAccount}}</span>
    </div>
    <div class="line"></div>
    <div class="smoney">
      <img class="red" src="../../images/main/red.png" alt>
      <span class="txt">提额金额：</span>
      <input
        type="tel"
        placeholder="请输入提现金额"
        v-model="price"
        @input="inputPrice"
      />
      <span class="red">当前可提现{{money}}元。</span>
    </div>
    <div class="info">备注：审核通过后，平台将在3-5个工作日内打款，若要修改银行账户信息请联系平台工作人员。</div>
    <div class="btn" @click="setInitiation()">提交审核</div>
  </div>
</template>
<script>
import axios from "axios";
import qs from "qs"; // 将请求转换成form 表单提交形式
export default {
  data() {
    return {
      price: '',
      info: {},
      money:0,
      sum:true
    };
  },
  methods: {
    inputPrice() {
      this.price = this.price.replace(/[^0-9]/ig,"")
      this.price > this.money ? this.price = this.money : ( this.price < 0 ? this.price = 0 : null );
    },
    /**
     * 获取提现详情
     */

    getInDetals: function () {
      let that = this;
      axios({
        method: "post",
        url: `${this.$store.state.url}/withdrawal/selectAccountByPartnerId`,
        data: qs.stringify({
          partnerId: this.$store.state.partnerId,
        })
      }).then(res => {
        if (res.data.code == 0) {
          // that.info = res.data.data;
          if ( res.data && res.data.data && res.data.data.account ) {
            this.info = res.data.data.account
            this.money = res.data.data.balance
          }
        } else {
          this.$alert(res.data.msg,{
          confirmButtonText: "确定",
          callback: function() {
            that.$router.push({
              path:'/main/finance'
            })
          }
          });
        }
      })
    },
    /**
     * 提现
     */
    setInitiation: function() {
      if ( this.info.balance == 0 ) {
        this.$message ({
          message: '您的余额为0',
          type: 'warning'
        });
        return;
      }
      if(!this.sum) {
        return
      }
      let that = this;
      that.sum = false
      axios({
        method: "post",
        url: `${this.$store.state.url}/withdrawal/addWithdrawal`,
        data: qs.stringify({
          withdrawalUser: this.$store.state.partnerId,
          price: that.price
        })
      }).then(res => {
        that.sum = true
        if (res.data.code == 0) {
          this.$store.state.fn.success( res.data.msg ).then (() => {
              this.$router.push({
                path:'/main/finance'
              })
            });
        } else {
          // alert('系统错误,请稍后重试!');
          this.$alert ( res.data.msg );
        }
      }).catch ( res=> {
          that.$alert('系统错误!')
      })
    }
  },
  mounted () {
    this.getInDetals()
  }
};
</script>
<style scoped>
.box {
  background: #ffffff;
  box-shadow: 0 5px 20px 0 rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  width: 861px;
  height: 816px;
  margin: 66px auto;
}
.head {
  height: 104px;
  text-align: center;
  font-size: 24px;
  color: #000;
  line-height: 104px;
  border-bottom: 3px solid #f5f5f5;
  font-weight: bold;
}
.list {
  height: 25px;
  line-height: 25px;
  padding-left: 245px;
  font-weight: bold;
  margin-top: 30px;
}
.list.fir {
  margin-top: 52px;
}
.txt {
  width: 90px;
  display: inline-block;
  font-weight: bold;
  margin-right: 67px;
}
.list img {
  width: 10px;
  height: 10px;
  padding: 7.5px;
  float: left;
}
.line {
  background: #f5f5f5;
  width: 861px;
  height: 3px;
  margin-top: 48px;
}
input {
  background: #ffffff;
  box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5);
  width: 317px;
  height: 40px;
  font-size: 18px;
  color: #4a4a4a;
  margin-right: 18px;
  text-align: center;
}
.smoney {
  padding-left: 110px;
  height: 40px;
  line-height: 40px;
  margin-top: 46px;
}
.smoney .txt {
  margin-right: 40px;
}
.red {
  color: #fd0404;
  font-size: 14px;
  font-weight: bold;
}
.info {
  text-align: center;
  height: 20px;
  line-height: 20px;
  color: #fd0404;
  font-size: 14px;
  font-weight: bold;
  margin-top: 27px;
}
.btn {
  margin: 0 auto;
  margin-top: 72px;
  background: #4B74FF;
  width: 255px;
  height: 55px;
  font-size: 18px;
  color: #ffffff;
  font-weight: bold;
  text-align: center;
  line-height: 55px;
  cursor: pointer;
}
</style>
